<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>消息</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <link rel="stylesheet" href="/js/bootstrap-4.1.1-dist/css/bootstrap.min.css">
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/bootstrap-4.1.1-dist/js/bootstrap.min.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <link href="/css/likeHistory.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
</head>

<script>
    //获取登录对象
    var user = JSON.parse(sessionStorage.getItem("user"));

    var obj = {};
    $.get("/userChats/" + user.id, function (data) {
        //如果没有联系人的时候设置暂无联系人
        if(data.length === 0){
            $(".aui-scrollView").html("<div class=\"aui-center\">\n" +
                "            <span class=\"aui-center-title\">暂无联系人</span>\n" +
                "        </div>");
        }
        //列表页面回显
        $(".aui-scrollView").renderValues({list:data},{
            //设置回复时间
            getTime:function (item,value) {
                $(item).html(CurentTime(new Date(value)));
            },
            //名字右边的回复的数量
            getCount:function(item,value){
                if(value>0){
                    $(item).html(value);
                    $(item).attr("class","badge badge-danger badge-pill");
                }
            },
            //点击好友跳转聊天界面,注意不是点的头像
            getHref:function (item,value) {
                var url=$(item).data("href");
                $(item).attr("href",url+value);
            }
        });
        //点击好友头像跳转到好友的个人信息页面
        $(".aui-flex-logo").click(function () {
            window.location.href="/userProfiles.html?id="+$(this).data("id");
            return false;
        });
    });
    /**
     * @return {string}
     */
    function CurentTime(date) {
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var day = date.getDate();
        var hh = date.getHours();
        var mm = date.getMinutes();
        var clock = year + "-";
        if (month < 10)
            clock += "0";
        clock += month + "-";
        if (day < 10)
            clock += "0";
        clock += day + " ";
        if (hh < 10)
            clock += "0";
        clock += hh + ":";
        if (mm < 10) clock += '0';
        clock += mm;
        return clock;
    }

</script>

<body>

<section class="aui-flexView">
    <header class="aui-navBar aui-navBar-fixed b-line">
        <a href="/mine/message.html" class="aui-navBar-item">
            <i class="icon icon-return"></i>
        </a>
        <div class="aui-center">
            <span class="aui-center-title">私信</span>
        </div>
        <a href="javascript:;" class="aui-navBar-item">
        </a>
    </header>
    <section class="aui-scrollView">
        <div5 class="aui-list-box" render-loop="list">
            <a data-href="/mine/chat.html?id=" class="aui-flex" render-key="list.acceptUser.id" render-fun="getHref">
                <div class="aui-flex-logo" render-attr="data-id=list.acceptUser.id">
                    <img render-src="list.acceptUser.headImgUrl"  alt="">
                </div>
                <div class="aui-flex-box">
                    <h2>
                        <span render-html="list.acceptUser.nickName"></span> <span render-key="list.totalCount" render-fun="getCount"></span>
                       <!--这里没用--> <span style="font-size: 12px" render-key="list.likeType" render-fun="getType"></span>
                    </h2>
                </div>
                <span class="aui-flex-add" render-key="list.createTime" render-fun="getTime">
                </span>
            </a>
        </div5>
    </section>
</section>

</body>
</html>